<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>预解释</title>
</head>

<body>

</body>

<script>
  /*
    预解释（变量提升）：
      在当前的作用域中，JS代码执行之前，浏览器首先会默认的把所有带var和function的进行提前的声明或者定义
      1) 理解声明和定义
      var num = 12;
      声明(declare):var num; ->告诉浏览器在全局作用域中有一个num的变量了,如果一个变量只是声明了
      但是没有赋值，默认的值是undefined
      定义(defined):num=12; ->给我们的变量进行符值
  
      2) 对于带var和function关键字的在预解释的时候操作还是不一样的
      var ——> 在预解释的时候只是提前的声明
      function ——> 在预解释的时候提前的声明+定义都完成了

      3) 预解释只发生在当前的作用域下，例如：开始只对window下的进行预解释，只有函数执行的时候才会
      对函数中的进行预解释
  */

  console.log(num); // undefined
  var num = 12;
  console.log(num); // 12

  var obj = { name: 'xxch', age: 18 };

  fn(100, 200); //可以在上面执行，因为预解释的时候声明+ 定义就已经完成了
  function fn(num1, num2) {
    var total = num1 + num2;
    console.log(total);
  }

  /*
    js中内存的分类：
    栈内存：用来提供一个供js代码执行的环境 -> 作用域（全局作用域/私有作用域）
    堆内存：用来存储引用数据类型的值 -> 对象存储的是属性名和属性值，函数存储的是代码字符串
  */

</script>

</html>